import Analysis from "./component/analysis";
import DataOverview from "./NewComponents/DataOverview.vue"
import FansPortrait from "./component/FansPortrait";
import LiveDetail from "./NewComponents/LiveDetail"
import TalentVideo from "./component/talentVideo";
import CargoAnalysis from "./NewComponents/CargoAnalysis"
import Ecommerce from "./component/Ecommerce";
import VideoDetail from "./NewComponents/VideoDetail"
import liveRecord from "./component/liveRecord";
import FansAnalysis from "./NewComponents/FansAnalysis"
import liveData from "./component/liveData";
import StarMap from "./component/StarMap";
import VueQr from "vue-qr";
import KChart from "./NewComponents/KChart.vue"
export default {
    components: {
        Analysis,
        FansPortrait,
        VueQr,
        TalentVideo,
        Ecommerce,
        liveRecord,
        liveData,
        StarMap,
        DataOverview,
        LiveDetail,
        CargoAnalysis,
        VideoDetail,
        FansAnalysis,
        KChart
    },
    data() {
        return {
            authorId: '', //达人id
            FansDays: '近7天', //粉丝趋势
            FabulousDays: "近7天", //点赞趋势
            FansliveTime: '', //粉丝弹窗选择时间
            FabulousliveTime: '', //点赞弹窗选择时间
            FansStartEnd: '',
            FabulousStartEnd: '',
            startDate1: '',
            endDate1: '',
            startDate2: '',
            endDate2: '',
            activeName: "0",
            infoData: {},
            showBtn: true, //展开==收起
            showPopup: false, //更多按钮
            scareValue: 3, //口碑评分
            showMouthEchart: false,
            showFansEchart: false,
            showFabulousEchart: false,
            changeBoard: true,

            //左侧echarts弹窗数据
            FansEchart: {
                xData: [],
                yData1: [],
                yData2: []
            },

            FabulousEchart: {
                xData: [],
                yData1: [],
                yData2: []
            },
            PraiseData: {}
        };
    },
    computed: {
        sliceStr() {
            if (this.infoData.introduce != null) {
                return this.infoData.introduce.substring(0, 30) + "...";
            }
            return '';
        }
    },
    watch: {
        FansDays: function (newVal, oldVal) {
            this.FansEchart.yData1 = []
            this.FansEchart.yData2 = []
            this.FansEchart.xData = []
            this.getFansEchart()
        },

        FabulousDays: function (newVal, oldVal) {
            this.FabulousEchart.yData1 = []
            this.FabulousEchart.yData2 = []
            this.FabulousEchart.xData = []
            this.getFabulousEchart()
        },
    },
    created() {
        this.authorId = this.$route.params.id;
        if (this.$route.params.index) {
            this.activeName = this.$route.params.index;
        }
        this.getInfoData();
        this.getFansEchart()
        this.getFabulousEchart()
        this.getPublicPraiseTrend()
        this.showChangeList()
    },
    mounted() { },

    methods: {
        FansPicker() {
            this.FansDays = '';
            this.FansEchart.yData1 = [];
            this.FansEchart.yData2 = [];
            this.FansEchart.xData = []
            this.getFansEchart()
        },
        FabulousPicker() {
            this.FabulousDays = '';
            this.FabulousEchart.yData1 = [];
            this.FabulousEchart.yData2 = [];
            this.FabulousEchart.xData = []
            this.getFansEchart()
        },
        showChangeList() {
            this.$axios.get("/api/Author/GetPublicPraiseTrend", {
                params: {
                    authorId: this.authorId,
                    trendType: 1
                }
            }).then((res) => {
                console.log(res)
                this.scareValue = res.data.data.publicPraise
                this.PraiseData = res.data.data
            })
        },
        // 
        changeList(e) {
            if (this.changeBoard == e) return  //防止一直点击同一个按钮一直请求数据
            this.changeBoard = e;
            this.$axios.get("/api/Author/GetPublicPraiseTrend", {
                params: {
                    authorId: this.authorId,
                    trendType: e ? 1 : 2
                }
            }).then((res) => {
                this.scareValue = res.data.data.publicPraise
                // this.percentage = res.data.data.percentage
                this.PraiseData = res.data.data
            })
        },
        // 获取左侧粉丝图表数据
        getFansEchart() {
            switch (this.FansDays) {
                case "近7天":
                    this.endDate1 = this.timestamp(Date.now() / 1000 - 86400 * 1, "Y-M-D");
                    this.startDate1 = this.timestamp(
                        Date.now() / 1000 - 86400 * 7,
                        "Y-M-D"
                    );
                    break;
                case "30天":
                    this.endDate1 = this.timestamp(Date.now() / 1000 - 86400 * 1, "Y-M-D");
                    this.startDate1 = this.timestamp(
                        Date.now() / 1000 - 86400 * 30,
                        "Y-M-D"
                    );
                    break;
                case "90天":
                    this.endDate1 = this.timestamp(Date.now() / 1000 - 86400 * 1, "Y-M-D");
                    this.startDate1 = this.timestamp(
                        Date.now() / 1000 - 86400 * 90,
                        "Y-M-D"
                    );
                    break;
                default:
                    this.startDate1 = this.FansliveTime[0];
                    this.endDate1 = this.FansliveTime[1];
                    break;
            }
            this.FansliveTime = [this.startDate1, this.endDate1];
            this.$axios.get("/api/Author/GetFansFavoriteTrend", {
                params: {
                    AuthorId: this.authorId,
                    trendType: 1,
                    star_time: this.startDate1,
                    end_time: this.endDate1
                }
            }).then((res) => {
                let that = this
                if (res.data.code == 0) {
                    this.FansEchart.yData1 = res.data.data.datas1
                    this.FansEchart.yData2 = res.data.data.datas2
                    res.data.data.dates.forEach((item, index) => {
                        that.FansEchart.xData.push(that.timestamp(item, "Y-M-D"));
                        return that.FansEchart.xData;
                    });

                }
            })
        },
        // 获取左侧点赞趋势图表数据
        getFabulousEchart() {
            switch (this.FabulousDays) {
                case "近7天":
                    this.endDate2 = this.timestamp(Date.now() / 1000 - 86400 * 1, "Y-M-D");
                    this.startDate2 = this.timestamp(
                        Date.now() / 1000 - 86400 * 7,
                        "Y-M-D"
                    );
                    break;
                case "30天":
                    this.endDate2 = this.timestamp(Date.now() / 1000 - 86400 * 1, "Y-M-D");
                    this.startDate2 = this.timestamp(
                        Date.now() / 1000 - 86400 * 30,
                        "Y-M-D"
                    );
                    break;
                case "90天":
                    this.endDate2 = this.timestamp(Date.now() / 1000 - 86400 * 1, "Y-M-D");
                    this.startDate2 = this.timestamp(
                        Date.now() / 1000 - 86400 * 90,
                        "Y-M-D"
                    );
                    break;
                default:
                    this.startDate2 = this.FabulousliveTime[0];
                    this.endDate2 = this.FabulousliveTime[1];
                    break;
            }
            this.FabulousliveTime = [this.startDate2, this.endDate2];
            this.$axios.get("/api/Author/GetFansFavoriteTrend", {
                params: {
                    AuthorId: this.authorId,
                    trendType: 2,
                    star_time: this.startDate2,
                    end_time: this.endDate2
                }
            }).then((res) => {
                this.FabulousEchart.yData1 = res.data.data.datas1
                this.FabulousEchart.yData2 = res.data.data.datas2
                res.data.data.dates.forEach((item, index) => {
                    this.FabulousEchart.xData.push(this.timestamp(item, "Y-M-D"));
                    return this.FabulousEchart.xData
                });
            })
        },
        // 收藏
        addStar() {
            let that = this;
            that.$axios
                .post(
                    "/api/collection/InsertCollection",
                    {
                        CollectId: that.authorId,
                        Module: 1 //模块 1达人 2视频 3音乐 4话题 5商品
                    },
                    {
                        cancelToken: new that.$axios.CancelToken(function executor(c) {
                            if (that.cancel != null) {
                                that.cancel();
                            }
                            that.cancel = c;
                        })
                    }
                )
                .then(res => {
                    if (res.data.code == 0) {
                        that.infoData.isCollect = 1;
                    }
                })
                .catch(err => {
                    console.log(err);
                });
        },
        // 取消收藏
        cancelStar() {
            let that = this;
            that.$axios
                .post(
                    "/api/collection/CancelCollection",
                    {
                        CollectId: that.authorId,
                        Module: 1 //模块 1达人 2视频 3音乐 4话题 5商品
                    },
                    {
                        cancelToken: new that.$axios.CancelToken(function executor(c) {
                            if (that.cancel01 != null) {
                                that.cancel01();
                            }
                            that.cancel01 = c;
                        })
                    }
                )
                .then(res => {
                    if (res.data.code == 0) {
                        that.infoData.isCollect = 0;
                    }
                })
                .catch(err => {
                    console.log(err);
                });
        },
        // 获取左侧详情数据
        getInfoData() {
            let that = this;
            that.finishLeft = false;
            this.$axios
                .get("/api/Author/GetAuthorDetailInfo", {
                    params: {
                        authorId: that.authorId,
                        'api-version': 2
                    }
                })
                .then(res => {
                    if (res.data.code == 0) {
                        that.infoData = res.data.data;
                        that.finishLeft = true;
                        document.title = res.data.data.nickName + '-达人数据|粉丝|视频|直播数据分析-掌上精选';
                    }
                })
                .catch(err => {
                    console.log(err);
                });
        },

        toRankPage(index, item1) {
            // console.log('index', index)
            // console.log('item1', item1)
            let str1 = "";
            let str2 = "";
            if (index == 1) {
                str1 = item1.match(/(\S*)排行榜/)[1];
                str2 = item1.match(/排行榜(\S*)第/)[1];
            }
            // console.log('str1', str1)
            // console.log('str2', str2)
            this.$router.push({
                path: `/talent_main/fans_main/${index}/${str1}/${str2}`
            });
        },
        // 带货口碑
        getPublicPraiseTrend() {
            this.$axios
                .get("/api/Author/GetPublicPraiseTrend", {
                    params: {
                        authorId: this.authorId,
                        trendType: this.trendType

                    }
                })
                .then(res => {
                    console.log(res)
                })
                .catch(err => {
                    console.log(err);
                });
        }
    }
};
